<!--
 * @Description: In User Settings Edit
 * @Author: your name
 * @Date: 2019-08-07 13:41:28
 * @LastEditTime: 2020-03-07 17:26:36
 * @LastEditors: Please set LastEditors
 -->
<!doctype html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport"
			content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0,viewport-fit=cover" />
		<meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
		<title>Hello APP</title>
		<link rel="stylesheet" type="text/css" href="../css/vant.css">
		<link rel="stylesheet" type="text/css" href="../css/base.css" />
		<link rel="stylesheet" type="text/css" href="../css/local.css" />
		<script type="text/javascript" src="../script/jquery.js"></script>
		<script type="text/javascript" src="../script/layer/mobile/layer.js"></script>
		<script type="text/javascript" src="../script/vue.min.js"></script>
		<script src="../script/vant.min.js"></script>
		<script type="text/javascript" src="../script/fastclick.js"></script>
		<script type="text/javascript" src="../script/base.js"></script>
		<style type="text/css">
			.head {
				background: #efefef;
				color: #000;
			}

			.van-nav-bar__title {
				color: #323233;
			}

			.van-nav-bar .van-icon {
				color: #323233;
			}

			.bg {
				background: #efefef;
				padding: 40px 15px 15px;
			}

			.header {
				position: relative;
			}

			.header .user-img {
				width: 50px;
				height: 50px;
				border-radius: 25px;
				overflow: hidden;
			}

			.header .user-img img {
				width: 100%;
				height: 100%;
			}

			.header .user-info {
				position: absolute;
				left: 55px;
				top: 0;
				right: 0;
				/* color: #fff; */
				padding: 0 10px;
				color: #717171;
			}

			.header .user-info .info-1 {
				height: 24px;
				line-height: 24px;
			}

			.header .user-info .info-2 {
				height: 26px;
				line-height: 26px;
				font-size: 17px;
			}

			.part {
				padding: 10px 15px 0;
			}

			.part>div {
				background: #fff;
				border-radius: 8px;
				overflow: hidden;
			}

			.part .van-cell__title {
				max-width: none;
				font-weight: 500;
				color: #797a7b;
			}

			.part img {
				height: 20px;
				margin-top: 2px;
				margin-right: 5px;
			}

			.other {
				height: 60px;
				background: #fff;
				border-bottom: 1px solid #ebedf0;
				text-align: center;
				padding-top: 5px;
				border-radius: 8px;
			}

			.other div {
				line-height: 26px;
			}

			.pay-text {
				color: #797a7b;
				font-size: 13px;
			}

			.login-out {
				height: 38px;
				line-height: 36px;
			}

			.button {
				text-align: center;
				background: #ffffff;
				padding-top: 20px;
				color: #3a3a3a;
			}

			.button .van-col {
				margin-bottom: 10px;
			}

			.img {
				position: relative;
			}

			.img img {
				height: 24px;
			}

			.img-text {
				font-size: 12px;
				margin-top: 4px;
				margin-bottom: 5px;
			}

			.img .num {
				position: absolute;
				right: 14px;
				top: -6px;
				color: #cd1b21;
				width: 16px;
				height: 16px;
				line-height: 14px;
				border-radius: 8px;
				font-size: 12px;
				border: 1px solid #cd1b21;
				background: #fff;
			}

			.van-cell__value {
				text-align: right;
				color: #9e9e9e;
				font-size: 12px;
			}

			.s-5 {
				width: 20%;
			}

			.s-5 .img-text {
				color: #797a7b;
			}

			.vip img {
				width: 16px;
				margin-left: 5px;
			}

			.vip * {
				vertical-align: middle;
			}
		</style>
	</head>

	<body>
		<div id="app" v-cloak>
			<div class="init-full">
				<!-- <van-nav-bar class="head" title="我的"></van-nav-bar> -->
				<div class="body-no-bottom">
					<div class="content">
						<div class="bg">
							<div class="header">
								<div class="user-img">
									<img
										:src="(userInfo && userInfo.Picture)?(shoppingMallServerIP + userInfo.Picture):'../image/header.png'" />
								</div>
								<div v-if="userInfo">
									<div class="user-info" @click="vipInfo">
										<div style="line-height: 26px;">{{userInfo.UserName}}</div>
										<div class="vip" v-if="userInfo && userInfo.IsArrears">
											<span>{{userInfo.gradeName}}&nbsp;&nbsp;</span>
											<img src="../image/vip.png" />
										</div>
									</div>
								</div>
								<div v-else>
									<div class="user-info">
										<div style="line-height: 50px;" @click="loginAPP">您尚未登录,请点击登录</div>
									</div>
								</div>

							</div>
						</div>
						<div style="padding: 0 15px;" v-if="userInfo">
							<div class="other" style="background: transparent;margin-top:-10px;">
								<van-row>
									<van-col span="6">
										<div @click="openWinPage('collection')">
											<div>{{collectionNum}}</div>
											<div class="pay-text">收藏夹</div>
										</div>

									</van-col>
									<van-col span="6">
										<div @click="openWinPage('addressList')">
											<div>{{addressNum}}</div>
											<div class="pay-text">收货地址</div>
										</div>

									</van-col>
									<van-col span="6">
										<div>
											<div>{{userInfo.Points}}</div>
											<div class="pay-text">我的积分</div>
										</div>

									</van-col>
									<van-col span="6">
										<div @click="openWinPage('transactionRecord')">
											<div>￥{{userInfo.Balance}}</div>
											<div class="pay-text">账户余额</div>
										</div>

									</van-col>
								</van-row>
							</div>
						</div>

						<div style="padding: 0 15px;margin-top: 10px;">
							<div style="border-radius:8px;overflow:hidden;">
								<van-cell title="我的订单" value="查看全部" style="padding: 4px 15px;" @click="intoOrder(0)">
									<van-icon slot="right-icon" name="arrow" color="#9e9e9e"
										style="line-height: inherit;" />
								</van-cell>
								<div class="button">
									<van-row>
										<van-col span="4" class="s-5">
											<div @click="intoOrder(1)">
												<div class="img">
													<img src="../image/shopppingMall/dfk.png" />
													<span class="num"
														v-if="undealNum.num1 && userInfo">{{undealNum.num1}}</span>
												</div>
												<div class="img-text">待付款</div>
											</div>
										</van-col>
										<van-col span="4" class="s-5">
											<div @click="intoOrder(2)">
												<div class="img">
													<img src="../image/shopppingMall/dfh.png" />
													<span class="num"
														v-if="undealNum.num2 && userInfo">{{undealNum.num2}}</span>
												</div>
												<div class="img-text">待发货</div>
											</div>
										</van-col>
										<van-col span="4" class="s-5">
											<div @click="intoOrder(3)">
												<div class="img">
													<img src="../image/shopppingMall/dsh.png" />
													<span class="num"
														v-if="undealNum.num3 && userInfo">{{undealNum.num3}}</span>
												</div>
												<div class="img-text">待收货</div>
											</div>
										</van-col>
										<van-col span="4" class="s-5">
											<div @click="intoOrder(21)">
												<div class="img">
													<img src="../image/shopppingMall/pj.png" />
													<span class="num"
														v-if="undealNum.num4 && userInfo">{{undealNum.num4}}</span>
												</div>
												<div class="img-text">待评价</div>
											</div>
										</van-col>
										<van-col span="4" class="s-5">
											<div @click="intoOrder(-1)">
												<div class="img">
													<img src="../image/shopppingMall/sh.png" />
													<span class="num"
														v-if="undealNum.num5 && userInfo">{{undealNum.num5}}</span>
												</div>
												<div class="img-text">退款</div>
											</div>
										</van-col>
									</van-row>
								</div>
							</div>

						</div>

						<div class="part">
							<div>
								<van-cell title="个人信息" is-link @click="openWinPage('personalInfo')">
									<img slot="icon" src="../image/userInfo.png" />
								</van-cell>
								<van-cell title="企业信息" is-link @click="openWinPage('userInfo')">
									<img slot="icon" src="../image/person.png" />
								</van-cell>
								<!-- <van-cell title="密码修改" is-link @click="openWinPage('passwordEdit')">
									<img slot="icon" src="../image/password.png" />
								</van-cell> -->
								<!-- <van-cell title="设置" is-link @click="openWinPage('config')">
									<img slot="icon" src="../image/appConfig.png" />
								</van-cell> -->
							</div>
						</div>
						<div class="part">
							<div>
								<van-cell title="关于我们" is-link @click="openWinPage('aboutUs')">
									<img slot="icon" src="../image/aboutUs.png" />
								</van-cell>
							</div>
						</div>
					</div>
					<van-loading v-if="showLoading" />
				</div>
			</div>
		</div>
	</body>

	<!-- 调用 uniapp webview 的 api ，记得需要写在 body 标签下面 -->
	<script src="../../../assets/script/uni.webview.1.5.4.js"></script>
	<script type="text/javascript">
		var vm;
		//$('.init-full').show();


		vm = new Vue({
			el: '#app',
			data: {
				showLoading: false,
				userInfo: FLD.getUserInfo() || '',
				shoppingMallServerIP: 'http://' + FLD.shoppingMallServerIP,
				undealNum: {
					num1: 0,
					num2: 0,
					num3: 0,
					num4: 0,
					num5: 0,
				},
				collectionNum: 0,
				addressNum: 0
			},
			created: function() {
				var that = this;

				FLD.mustLogin(function() {
					that.getUndealNum();
					that.getCollectionNum();
					that.getAddressNum();
					that.getNewUserData();
				})


			},
			methods: {
				getNewUserData() { // 用户信息
					var that = this;
					FLD.ajax('sp_getMemberInfo', {}, function(res) {
						that.userInfo = res.ds[0];
						window.localStorage.setItem('userInfo', JSON.stringify(res.ds[0]));
					})
				},
				getCollectionNum() { // 收藏夹
					var that = this;
					var obj = {
						pageIndex: 1,
						pageSize: 20
					}
					FLD.ajax('sp_favoriteList', obj, function(res) {
						that.collectionNum = res.ds1[0]['@TotalCount'];
					})
				},
				getAddressNum() {
					var that = this;
					var obj = {
						pageIndex: 1,
						pageSize: 20
					}
					FLD.ajax('sp_getShipAddress', obj, function(res) {
						that.addressNum = res.ds.length;
					})
				},
				getUndealNum() { // 订单各项数量
					var that = this;
					FLD.ajax('sp_statusOrderCount', {}, function(res) {
						that.undealNum.num1 = res.ds[0].num1;
						that.undealNum.num2 = res.ds1[0].num2;
						that.undealNum.num3 = res.ds2[0].num3;
						that.undealNum.num4 = res.ds3[0].num4;
						that.undealNum.num5 = res.ds4[0].num5;
					})
				},
				intoOrder(index) {
					var that = this;
					FLD.mustLogin(function() {
						if (index == -1) { // 退款
							that.openWinPage('refundList');
						} else { // 其他
							uni.navigateTo({
								url: "/pages/qms/shop/CommonPage?url=orderList&orderIndex=" + index
							});
						}
					})
				},
				openPage(row) {
					var that = this;
					var pageParam = {}
					if (row.Para) {
						var paraArray = row.Para.split(';');
						for (var i in paraArray) {
							var paraRowArray = paraArray[i].split('=');
							pageParam[paraRowArray[0]] = paraRowArray[1]
						}
					}
					pageParam.titleName = row.APFunName;
					if (row.FunType == '自定义') {
						api.openWin({
							name: row.AP_Link,
							url: row.AP_Link + '.html',
							reload: true,
							slidBackEnabled: false,
							allowEdit: false,
							pageParam: pageParam
						})
					} else if (row.FunType == '配置表单') {
						if (row.APFunName == '开票申请' && !FLD.getUserInfo().S_FP_TT) {
							that.$dialog.confirm({
								title: '提示',
								message: '您还未填写公司抬头和税号,是否前往设置?'
							}).then(() => {
								that.openWinPage('userInfo')
							}).catch(() => {

							});
						} else {
							api.openWin({
								name: 'formConfig',
								url: 'common/formConfig.html',
								reload: true,
								slidBackEnabled: false,
								pageParam: pageParam
							})
						}

					} else if (row.FunType == '配置列表') {
						api.openWin({
							name: 'formHistoricalDocuments',
							url: 'common/formHistoricalDocuments.html',
							reload: true,
							slidBackEnabled: false,
							pageParam: pageParam
						})
					} else if (row.FunType == '配置图表') {
						api.openWin({
							name: 'formConfigChart',
							url: 'common/formConfigChart.html',
							reload: true,
							slidBackEnabled: false,
							pageParam: pageParam
						})
					} else if (row.FunType == '配置报表') {
						api.openWin({
							name: pageParam.objName + '_0',
							url: 'common/formConfigReport.html',
							reload: true,
							slidBackEnabled: false,
							pageParam: pageParam
						})
					}

				},
				openPayment(type) {
					FLD.mustLogin(function() {
						api.openWin({
							name: 'payment',
							url: 'payment.html',
							reload: true,
							slidBackEnabled: false,
							pageParam: {
								type: type
							}
						})
					})

				},
				openWinPage(url) {
					uni.navigateTo({
						url: "/pages/qms/shop/CommonPage?url=" + url
					});
				},
				vipInfo() {
					var that = this;
					if (that.userInfo && that.userInfo.IsArrears) {
						api.openWin({
							name: 'vipInfo',
							url: 'vipInfo.html',
							reload: true,
							slidBackEnabled: false
						})
					}
				},

				openWinHPage(type) {
					api.openWin({
						name: 'historicalDocuments',
						url: 'common/historicalDocuments.html',
						reload: true,
						slidBackEnabled: false,
						pageParam: {
							type: type
						}
					})
				},
				loginAPP() {
					api.openWin({
						name: 'login',
						url: '../login.html',
						animation: {
							type: "movein", //动画类型（详见动画类型常量）
							subType: "from_bottom", //动画子类型（详见动画子类型常量）
							duration: 300 //动画过渡时间，默认300毫秒
						},
						reload: true,
						slidBackEnabled: false
					})
				}

			}
		})
	</script>

</html>